<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>天天生鲜-提交订单</title>
    <link rel="stylesheet" type="text/css" href="/static/css/reset.css">
    <link rel="stylesheet" type="text/css" href="/static/css/main.css">
</head>
<body>
{% include 'header.html' %}

<div class="search_bar clearfix">
    <a href="index.html" class="logo fl"><img src="/static/images/logo.png"></a>
    <div class="sub_page_name fl">|&nbsp;&nbsp;&nbsp;&nbsp;提交订单</div>
    <div class="search_con fr">
        <input type="text" class="input_text fl" name="" placeholder="搜索商品">
        <input type="button" class="input_btn fr" name="" value="搜索">
    </div>
</div>
<form id="order_detail">
    <input type="hidden" id="order_id" name="order_id" value="{{order_id}}"/>
    <h3 class="common_title">确认收货地址</h3>
    {% csrf_token %}

<div class="common_list_con clearfix">
    {% if address %}
    <dl>
        <dt>寄送到：</dt>
        <dd><input type="radio" name="" checked="">{{address.address}} ({{address.user_name}} 收)</dd>
    </dl>
    {%else%}
    <dl><dt>暂无收货地址</dt></dl>
    {%endif%}
    <a href="/user_center_site/" class="edit_site">编辑收货地址</a>

</div>

<h3 class="common_title">支付方式</h3>
<div class="common_list_con clearfix">
    <div class="pay_style_con clearfix">
        <input type="radio" value="1" name="pay_status" checked>
        <label class="cash">货到付款</label>
        <input type="radio" value="2" name="pay_status">
        <label class="weixin">微信支付</label>
        <input type="radio" value="3" name="pay_status">
        <label class="zhifubao"></label>
        <input type="radio" value="4" name="pay_status">
        <label class="bank">银行卡支付</label>
    </div>
</div>

<h3 class="common_title">商品列表</h3>

<div class="common_list_con clearfix">
    <ul class="goods_list_th clearfix">
        <li class="col01">商品名称</li>
        <li class="col02">商品单位</li>
        <li class="col03">商品价格</li>
        <li class="col04">数量</li>
        <li class="col05">小计</li>
    </ul>
    {% for l in list %}
    <ul class="goods_list_td clearfix">
        <li class="col01">{{forloop.counter}}</li>
        <li class="col02"><img src="/{{l.ing_url}}"></li>
        <li class="col03">{{l.good_name}}</li>
        <li class="col04">{{l.unit}}</li>
        <li class="col05">{{l.price}}元/{{l.unit}}</li>
        <li class="col06">{{l.num}}</li>
        <li class="col07">{{l.total_price}}元</li>
    </ul>
    {% endfor %}
</div>

<h3 class="common_title">总金额结算</h3>

<div class="common_list_con clearfix">
    <div class="settle_con">
        <div class="total_goods_count">共<em>{{count}}</em>件商品，总金额<b>{{total_price}}元</b></div>
        <div class="transit">运费：<b>10元</b></div>
        <div class="total_pay">实付款：<b>{{total_price|add:10}}元</b></div>
    </div>
</div>

<div class="order_submit clearfix">
    <!--		<a href="javascript:;" id="order_btn">提交订单</a>-->
    <input type="button" id="order_btn" value="提交订单"/>
</div>
    </form>
{% include 'footer.html' %}

<div class="popup_con">
    <div class="popup">
        <p>订单提交成功！</p>
    </div>

    <div class="mask"></div>
</div>
<script type="text/javascript" src="/static/js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
<!--		$('#order_btn').click(function() {-->
<!--			localStorage.setItem('order_finish',2);-->

<!--			$('.popup_con').fadeIn('fast', function() {-->

<!--				setTimeout(function(){-->
<!--					$('.popup_con').fadeOut('fast',function(){-->
<!--						window.location.href = 'index.html';-->
<!--					});	-->
<!--				},3000)-->
<!--				-->
<!--			});-->
<!--		});-->

		$('#order_btn').click(function() {
		   var order_id=$('#order_id').val();
           var url="/place_order/";
           if(order_id>0){
               url="/user_center_order/"+order_id+"/";
            }
		   $.ajax({
                   type:"POST",
                   url:url,
                   data:$('#order_detail').serialize(),
                   async:false,
                   error:function(request){
                   alert("程序出错，请联系管理员");
                   },
                   success:function(data){
                   if(data.status!=0){
                       localStorage.setItem('order_finish',2);
                       $('.popup_con').fadeIn('fast',function(){
                       setTimeout(function(){
                            $('.popup_con').fadeOut('fast',function(){
                            window.location.href='/user_center_order/0';
                        });},2000)
                   });
                   }else{
                   alert(data.msg);
                   }
                   }
                   });
		     });



</script>
</body>
</html>